<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:core="http://www.contact.core.com/contacts/core/ui"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:common="http://www.contact.common.com/contacts/ui"
      xmlns:contact="http://www.contact.contact.com/contacts/contact/ui"
        >

<ui:component>

    <h:panelGroup layout="block" style="width: 100%; height:100%;">
        <h:form>


            <rich:panel id="myContactPanelAll"
                        bodyClass="rich-laguna-panel-no-header"
                        style="vertical-align:top; overflow:auto; border:none; min-height:30px; height:auto; padding-bottom:10px; width:100%;">

                <a4j:outputPanel rendered="#{not myContactSessionBean.show}" style="float:left">
                    <a4j:commandLink reRender="myContactPanelAll"
                                     value="+ Show My Contact's Card"
                                     action="#{myContactBean.show}"/>

                </a4j:outputPanel>
                <a4j:outputPanel rendered="#{myContactSessionBean.show}" style="float:right">
                    <a4j:commandLink reRender="myContactPanelAll"
                                     value="Hide"
                                     action="#{myContactBean.hide}"/>

                </a4j:outputPanel>

                <a4j:outputPanel rendered="#{myContactSessionBean.show}" id="showMyContactPanel">
                    <contact:myContact/>
                </a4j:outputPanel>


            </rich:panel>
        </h:form>

        <common:confirmModalPanel id="myContactConfirmModalPanel"
                                  bean="#{myContactBean}"
                                  message="#{myContactSessionBean.message}"
                                  header="#{myContactSessionBean.header}"
                                  reRender="myContactCardViewPanel"/>
        <!--<rich:panel id="myContactPanel"-->
        <!--bodyClass="rich-laguna-panel-no-header"-->
        <!--style="vertical-align:top; overflow:auto; min-height:200px; height:auto; width:100%;">-->
        <!--<contact:myContact/>-->
        <!--</rich:panel>-->

        <h:panelGroup layout="block" style="vertical-align:bottom; width:100%;">
            <!--<h:panelGroup id="allContactPanel" layout="block" style="float:left; width:100%">-->
            <contact:allContact/>

            <!--</h:panelGroup>-->
            <!--<h:panelGroup id="otherContactPanel" layout="block" style="float:left;">-->
            <!--<contact:otherContact/>-->
            <!--</h:panelGroup>-->

        </h:panelGroup>

    </h:panelGroup>

    <contact:contactCardEdit id="contactModalPanel"
                             header="#{contactSessionBean.header}"
                             reRender="#{contactBean.reRender}"
            />
    <common:confirmModalPanel id="otherContactConfirmModalPanel"
                              bean="#{otherContactBean}"
                              message="#{otherContactSessionBean.message}"
                              header="#{otherContactSessionBean.header}"
                              reRender="otherContactPanel"/>
    <contact:uploadPicturePanel id="otherContactUploadPicture" reRender="allContactPanel, pictureCommandPanel"/>
</ui:component>


</html>
